import React, {useEffect, useMemo, useState} from "react";
import {DelClass, getCalss, getClassJson, getMajeur} from "../../../../api/api.js";
import College_EForm from "../CollegeTable/compent/College_EForm.jsx";
import {Button, Cascader, Dropdown, Select, Table, Tag, Toast} from "@douyinfe/semi-ui";
import Class_AForm from "./compent/Class_AForm.jsx";
import Class_EForm from "./compent/Class_EForm.jsx";
import {IconDelete, IconUndo} from "@douyinfe/semi-icons";
import {IconDown} from "@arco-design/web-react/icon";
import {School} from "@icon-park/react";

function ClassTable() {
    const [data,setdata] = useState()
    const [trdata,settrdata] = useState(null)
    const [fdata,setfdata] = useState(null)
    const [beifen,setbkdata] = useState(null)
    const [selectedValues, setSelectedValues] = useState("请选择学院/系部/专业");
    const [row,setrow] = useState(null)
    useEffect(()=>{
        getlist();
        getjsonlist();
    },[])
    async function getlist(){
        const res = await getCalss()
        res.data.data.forEach(v=>{
            v.key = v.ccid
        })
        setdata(res.data.data)
        setbkdata(res.data.data)
    }
    const rowSelection = useMemo(
        () => ({
            onSelect: (record, selected) => {
                if (selected) {
                    setrow(record.ccid);
                } else {
                    setrow(null);
                }
            },
        }),
        []
    );
    async function getjsonlist(){
        const res = await getClassJson()
        settrdata(res.data.data)
    }
    async function delclass() {
        let form = new FormData()
        form.append("id",row)
        const res = await DelClass(form)
        if (res.data.code==200){
            Toast.success('班级删除成功')
        }else {
            Toast.success('班级删除失败')
        }
    }

    function cool(i) {
        console.log(i)
    }
    const ceshishuju = [
        {
            text: 'Semi Design 设计稿',
            value: 'Semi Design 设计稿',
        },
        {
            text: 'Semi Pro 设计稿',
            value: 'Semi Pro 设计稿',
        },
    ];
    const columns = [
        {
            title: '班级编号',
            dataIndex: 'ccid',
        },

        {
            title: '班级名',
            dataIndex: 'clname',
        },
        {
            title: '专业名',
            dataIndex: 'majeurname',
        },
        {
            title: '系部名',
            dataIndex: 'rname',
        },
        {
            title: '学院名',
            dataIndex: 'cname',
        },
        {
            title: '操作',
            dataIndex: 'operate',
            render: (text, record, index) => {
                return (
                    <div>
                        <Class_EForm mess={record}></Class_EForm>
                    </div>
                );
            },

        },
    ];


    const pagination = useMemo(
        () => ({
            pageSize: 8,
        }),
        []
    );
    const Search = value => {
        console.log(value)
        const college = value[0]; // 学院
        const department = value[1]; // 系
        const majeur = value[2]//专业
        const clas = value[3]//班级
        const res = beifen.filter(v => {
            return v.cname == college&&v.rname == department&&v.majeurname == majeur&&v.ccid == clas;
        });
        setdata(res)
        setSelectedValues(value);
    }
    function getbk() {
        setdata(beifen)
        setSelectedValues("请选择学院/系部/专业/班级");
    }


    return(
        <>
            <h2><School theme="outline" size="24" fill="#4a90e2"/> 班级管理</h2>
            <Cascader
                onChange={Search}
                value={selectedValues}
                style={{ width: 260,marginRight:'15px' }}
                treeData={trdata}
                placeholder="请选择学院/系部/专业/班级"
            />
            <Button onClick={()=>{getbk()}} icon={<IconUndo />} theme="solid" style={{ marginRight: 10,backgroundColor:'rgba(var(--semi-red-4), 1)' }}>重置</Button>
            <Class_AForm></Class_AForm>
            <Button onClick={()=>{delclass()}} icon={<IconDelete />} theme='solid' type='warning' style={{ marginLeft: '5px' }}>删除班级</Button>
            <Table style={{marginTop:'15px'}} bordered={true} columns={columns} dataSource={data} rowSelection={rowSelection} pagination={pagination} />
        </>
    ) ;
}
export default ClassTable